<template>
    <div>
        <el-dialog class="taskdialog" title="" :width="dialogForm.width" :visible.sync="dialogForm.dialogVisible"
            :close-on-click-modal="false" :center="true">
            <div class="dialogTitle">
                {{ dialogForm.title }}
            </div>
            <el-table :data="tableData">
                <el-table-column prop="name" label="参与人"></el-table-column>
                <el-table-column label="完成情况">
                    <template slot-scope="scope">
                        <span v-if="scope.row.state == 0">未完成</span>
                        <span v-if="scope.row.state == 1">已完成</span>
                    </template>
                </el-table-column>
            </el-table>
            <!-- 空格 -->
            <el-table class="el-tables" empty-text=" "></el-table>
        </el-dialog>
    </div>
</template>
<script>
import { getTaskCompleteStatus } from "../../../../service/taskApi"
export default {
    props: ['dialogForm', 'id'],
    watch: {
        id: {
            handler: function () {
                this.getPerDate()
            },
            immediate: true,
        }
    },
    data() {
        return {
            dialogVisible: false,
            taskId: '',
            name: '',
            state: '',
            form: {
                name: '',//负责人
                state: '',//完成情况
                taskId: '',
            },
            tableData: [],
        }
    },
    created() {
    },
    methods: {
        getPerDate() {
            if (this.id != '') {
                getTaskCompleteStatus(this.id).then(res => {
                    if (res.code == 0) {
                        this.tableData = res.data;
                        this.form.id = res.data.id
                        this.name = res.data.name
                        this.state = res.data.state
                    }
                })
            }

        }
    }
}
</script>
<style lang="scss" scoped>
.dialogTitle {
    line-height: 60px;
    font-size: 18px;
    text-align: center;
    margin-top: -20px;
}

.taskdialog {
    margin-top: 150px;
}

.el-tables {
    margin-top: -10px;
}
</style>
